<include file="header" />
<body>
<div class="wraper">
    <div class="head clearfix">
        <a href="javascript:history.back();" class="iconfont icon-zuo pull-left"></a>
        <span class="head-name pull-left">优惠券</span>
        <a href="{BEESCRM::U('/Charger/Chargingprox/index',array('accountId'=>$accountId))}" class="iconfont icon-shouye pull-left text-right"></a>
    </div>
    <div class="lists text-center clearfix tab">
        <div class="third-list actived" data-type='1'>未使用（{BEESCRM:$noUseNoEndlist|count}）</div>
        <div class="third-list" data-type='2'>已使用（{BEESCRM:$useList|count}）</div>
        <div class="third-list" data-type='3'>已过期（{BEESCRM:$noUseEndList|count}）</div>
    </div>
    <font id="contents"></font>
    <!-- <div class="container padding">
        <div class="coupon coupon-new">
            <div class="coupon-contain">
                <img class="coupon-img" src="/assets/charger/images/coupon.png"/>
                <p class="coupon-name">5元优惠券</p>
            </div>
            <p class="lists text-gray">2016.04.16 - 2016.06.12</p>
            <div class="cover"></div>
        </div>
    </div>
    <div class="container padding">
        <div class="coupon coupon-new">
            <div class="coupon-contain">
                <img class="coupon-img" src="/assets/charger/images/coupon.png"/>
                <p class="coupon-name">5元优惠券</p>
            </div>
            <p class="lists text-gray">2016.04.16 - 2016.06.12</p>
        </div>
    </div>

    <div class="norecord">
        <img src="/assets/charger/images/nocoupon.png"/>
        <p>没有交易记录</p>
    </div> -->


    <!--<div class="container padding">
        <div class="coupon coupon-grey text-grey tb-mode">
            <div class="tb-cell coupon-left text-center">
                <p>￥<span class="text-20">5元</span></p>
                <p>充电优惠券</p>
            </div>
            <div class="tb-cell coupon-right text-12">
                <p>2016.04.16 - 2016.06.12</p>
                <p>智能充电优惠券or使用详情</p>
                <p>[已使用]</p>
            </div>
        </div>
    </div>-->
</div>
<include file="commonJS"/>
<script type="text/javascript">
    seajs.use("$",function() {
            $(function(){
                setData(1);
                $('.third-list').on('click',function(){
                    var type = $(this).data('type');
                    $(this).addClass('actived').siblings().removeClass('actived');
                    setData(type);
                })

//                $(document).on('click','.coupon',function(){
//                    var recordId = $(this).data('id');
//                    location.href="/coupon/coupon/coupon/record_id/"+recordId+"/account_id/"+"{BEESCRM:$accountId}";
//                    return false;
//                })
            })

            function setData(type){
                var str = '';
                $('#contents').html('');
                if(type==1){

                    str+='<volist name="noUseNoEndlist" id="vo">'
                    +'<div class="container padding">'
                                +'<a href="/coupon/coupon/coupon/record_id/'+{BEESCRM:$vo.record_id}+'/account_id/'+'{BEESCRM:$accountId}"  class="coupon coupon-new" data-id="{BEESCRM:$vo.record_id}">'
                                    +'<div class="coupon-contain">'
                                        +'<img class="coupon-img" src="/assets/charger/images/coupon.png"/>'
                                        +'<p class="coupon-name">{BEESCRM:$couponArr[$vo['coupon_id']]['title']}</p>'
                                    +'</div>'
                                    +'<p class="lists text-gray">有效期:{BEESCRM:$couponArr[$vo["coupon_id"]]["start_time"]|date="Y-m-d H:i",###} - {BEESCRM:$couponArr[$vo["coupon_id"]]["end_time"]|date="Y-m-d H:i",###}</p>'            
                                +'</a>'
                            +'</div>'
                            +'</volist>';
                }else if(type==2){
                        str+='<volist name="useList" id="vo">'
                              +'<div class="container padding">'
                                +'<a href="/coupon/coupon/coupon/record_id/'+{BEESCRM:$vo.record_id}+'/account_id/'+'{BEESCRM:$accountId}" class="coupon coupon-new" data-id="{BEESCRM:$vo.record_id}">'
                                    +'<div class="coupon-contain">'
                                        +'<img class="coupon-img" src="/assets/charger/images/coupon.png"/>'
                                        +'<p class="coupon-name">{BEESCRM:$couponArr[$vo['coupon_id']]['title']}</p>'
                                    +'</div>'
                                    +'<p class="lists text-gray">有效期:{BEESCRM:$couponArr[$vo["coupon_id"]]["start_time"]|date="Y-m-d H:i",###} - {BEESCRM:$couponArr[$vo["coupon_id"]]["end_time"]|date="Y-m-d H:i",###}</p>'            
                                +'</a>'
                            +'</div>'
                            +'</volist>';
                }else if(type==3){
                        str+='<volist name="noUseEndList" id="vo">'
                              +'<div class="container padding">'
                                +'<a href="/coupon/coupon/coupon/record_id/'+{BEESCRM:$vo.record_id}+'/account_id/'+'{BEESCRM:$accountId}" class="coupon coupon-new" data-id="{BEESCRM:$vo.record_id}">'
                                    +'<div class="coupon-contain">'
                                        +'<img class="coupon-img" src="/assets/charger/images/coupon.png"/>'
                                        +'<p class="coupon-name">{BEESCRM:$couponArr[$vo['coupon_id']]['title']}</p>'
                                    +'</div>'
                                    +'<p class="lists text-gray">有效期:{BEESCRM:$couponArr[$vo["coupon_id"]]["start_time"]|date="Y-m-d H:i",###} - {BEESCRM:$couponArr[$vo["coupon_id"]]["end_time"]|date="Y-m-d H:i",###}</p>'            
                                +'</a>'
                                +'<div class="cover"></div>'
                            +'</div>'
                            +'</volist>';
                }
                if(str==''){
                    str = '<div class="norecord">'
                             +'<img src="/assets/charger/images/nocoupon.png"/>'
                            +'<p>没有优惠券</p>'
                            +'</div>';
                }
                $('#contents').html(str);
            }
    })    
</script>
</body>
</html>